<template>
    <!-- 轮播图-->
    <div class="banner">
        <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
            <van-swipe-item v-for="(item,index) in bannerList" :key="index">
                <router-link tag="div" :to="{name:'details',params:{articleId:item.articleId}}">
                    <img :src="item.bannerImgUrl">
                </router-link>
            </van-swipe-item>
        </van-swipe>
    </div>
</template>

<script>
    import {getBanner} from '../api/CMS-api'
    export default {
        created(){
            getBanner(1, 4).then(res => {
                this.bannerList = res.rows
            });
        },
        data(){
            return{
                bannerList: [],
            }
        }
    }
</script>

<style lang="less" scoped>
    .banner {
        width: 100%;
        height: 220px;
        .my-swipe {
            width: 100%;
            height: 100%;
            img {
                width: 100%;
                height: 100%;
            }
        }
    }
</style>